<template>
    <div id="cutFree">
        <v-nav></v-nav>
        <div class="newAdd">
            <img class="poster" src="http://khh-server.oss-cn-beijing.aliyuncs.com/resourse/IMG/static/cutFree/heartcut_backgroung.jpg">
            <p>热销爆款</p>
        </div>
        <div class="newProductListWrapper">
            <section :style="this.list.length>2?'':'padding-bottom:1.2rem'">
                <mt-loadmore  :top-method="loadTop" :bottom-method="loadBottom" :bottom-all-loaded="allLoaded" ref="loadmore"  :topDistance="20" :bottomDistance="20" :topPullText="topPullText" :topDropText="topDropText" :bottomPullText="bottomPullText" :auto-fill="false">
                    <div :class="y%2==0?'newProductList flo-l':'newProductList flo-r'" v-for="(x,y) in list"  >
                        <header :id="x.pro_id" :type="x.id_type" @click="goNewDetail(x.pro_id,x.id_type)">
                            <dl>
                                <dd><img :src="x.pro_img"></dd>
                                <img v-if="x.stock_num===1" src="https://khh-server.oss-cn-beijing.aliyuncs.com/resourse/IMG/static/imgChange/WechatIMG146.png" style="position:absolute;top: 15%;left:27%;width: 1.8rem;height:1.8rem;">
                                <dt style="text-align: left">{{x.subtitle}}</dt>
                            </dl>
                        </header>
                        <footer :id="x.pro_id" :type="x.id_type" @click="goNewDetailShow(x.pro_id,x.id_type)">
                            <div>
                                <span class="priceColor flo-l"></span>
                                <span class="flo-l"><span class="priceColor">￥{{x.pro_price}}</span></span>
                                <span v-if="howMoney" class="flo-r">砍到{{x.min_shop_price}}元</span>
                                <span v-else class="flo-r">{{x.min_shop_price}}元得</span>
                            </div>
                        </footer>
                    </div>
                </mt-loadmore>
            </section>
        </div>
    </div>
</template>

<script>
  import store from "../store/newStore.js";
  import config from "../config/config.js";
  import share from "../share/share.js";
  import Nav from "../home/nav.vue";
  import MtaH5 from 'mta-h5-analysis';
  export default {
    name: "cut-zero",
    store,
    data() {
      return {
        list: [],
        pageSize:1,
        allLoaded:Boolean,
        pageSize:1,
        topDropText:'下拉刷新',
        topPullText:'',
        bottomPullText:''
      }
    },
    // computed:{
    //   ticket(){
    //     return this.$store.state.getTicket;
    //   }
    // },
    components:{
      "v-nav":Nav
    },
    methods: {
      getViewInfo(pageSize) {
        var tag = this.$route.params.tag;
        var value = JSON.stringify({
            "page": pageSize,
            "tag": tag,
            "token": localStorage.getItem('token')
          }),
          key = demo(value);
        axios.post('/Home/home/HomeTopButton', {
          value: value,
          key: key,
          ticket:this.ticket
        }, config)
          .then(function (response) {
            if (response.data.code == 200) {
              if(pageSize==1){
                this.list=response.data.data.list;
              }else{
                this.list=this.list.concat(response.data.data.list);
              }
              if(response.data.data.listNum==pageSize){
                this.$nextTick(function(){
                  this.allLoaded=true;
                })
              }else{
                this.$nextTick(function(){
                  this.allLoaded=false;
                })

              }
              this.$store.commit('increment',response.data.ticket);
            }else{
              this.$store.commit('increment',response.data.ticket);
            }
          }.bind(this))
          .catch(function (error) {
            console.log(error);
          });
      },
      loadBottom(){
        var self = this;
        setTimeout(function () {
          self.pageSize++;
          self.getViewInfo(self.pageSize);
          self.$refs.loadmore.onBottomLoaded();
        }, 500);
      },
      goNewDetail(id,type){
        this.$router.push('/newDetail/'+id+'/'+type)
      },
      goNewDetailShow(id,type){
        // this.$router.push('/newDetail/'+id+'/'+type);
        this.$router.push({
          path:'/newDetail/'+id+'/'+type,
          query:{
           show:1
          }
        })
      },
    },

    activated() {
      share({})
      this.getViewInfo(this.pageSize);
      MtaH5.init({
        "sid":'500594815',
        "cid":'500595819',
        "autoReport":0,
        "senseHash":0,
        "senseQuery":0,
        "performanceMonitor":0,
        "ignoreParams":[]
      });
      MtaH5.pgv();
    },
    deactivated(){
      this.$destroy(true)
    }
  }
</script>

<style scoped>

</style>